<!--添加人员控件-->

<template>
    <div class="page-box">

        <div class="page-search">
            <div>
                <label>领料编号</label>
                <el-input v-model="searchForm.Number" style="width:140px" placeholder="请输入领用编号"></el-input>
            </div>
            <div>
                <label>领料仓库</label>
                <el-select v-model="searchForm.WarehouseName" placeholder="请选择仓库" style="width: 160px;">
                    <el-option v-for="item in WarehouseList" :key="item.Id" :label="item.WarehouseName" :value="item.WarehouseName"></el-option>
                </el-select>
            </div>
            <div>
                <label>经办人</label>
                <el-input v-model="searchForm.EmployeesName" style="width:140px" placeholder="请输入经办人"></el-input>
            </div>
            <div>
                <label>领料日期</label>
                <el-date-picker type="date" v-model="searchForm.PickDate" style="width:140px" placeholder="请选择日期"
                    value-format="yyyy-MM-dd"></el-date-picker>
            </div>
            <div>
                <el-button type="primary" @click="search">查询</el-button>
                <el-button @click="reset">重置</el-button>
            </div>
        </div>



        <div class="page-section">
            <el-table :data="tableData" ref="dataForm" v-loading="isLoading" height="360">
                <el-table-column type="selection" width="55"></el-table-column>
                <el-table-column prop="Number" label="生产领料编号" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="WorkorderCode" label="领料工单编号" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="WarehouseName" label="领料仓库" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="EmployeesName" label="经办人" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column prop="Creator" label="创建者" :show-overflow-tooltip="true"></el-table-column>
                <el-table-column label="领料日期" :show-overflow-tooltip="true">
                    <template slot-scope="scope">
                        <span>{{ scope.row.PickDate | formatDateTime  }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="创建日期" :show-overflow-tooltip="true">
                    <template slot-scope="scope">
                        <span>{{ scope.row.CreateTime | formatDateTime  }}</span>
                    </template>
                </el-table-column>
                <el-table-column prop="Remark" label="备注" :show-overflow-tooltip="true"></el-table-column>

                <el-table-column label="操作" :show-overflow-tooltip="true">
                    <template slot-scope="scope">
                        <el-button type="text" @click="Checked(scope.row)">选择</el-button>
                    </template>
                </el-table-column>

            </el-table>


            <Pagination @handleSizeChange="handleSizeChange" @handleCurrentChange="handleCurrentChange"
                :PageIndex="pageDomain.PageIndex" :PageSize="pageDomain.PageSize" :TotalCount="pageDomain.TotalCount" />
        </div>


    </div>
</template>
<script>


import Pagination from '@/components/Pagination.vue';
export default {
    props: {
        BomList: {
            type: Array,
            required: true
        }
    },
    components: {
        Pagination
    },
    mounted() {
        this.dataBind();
        //获取仓库
        this.getWarehouseData();
    },
    data() {
        return {

            
            //仓库模型数据
            WarehouseList: [],

            //搜索字段
            searchForm: {
                Number: '',
                WarehouseName: '',
                EmployeesName: '',
                PickDate: ''
            },

            pageDomain: {
                PageIndex: 1,
                PageSize: 10,
                TotalCount: 0
            },
            tableData: [],
            isLoading: false


        }
    },
    methods: {
        Checked(model) {
            this.$emit('callback',model);
        },


        //搜索
        search() {
            this.pageDomain.PageIndex = 1;
            this.dataBind();
        },
        //重置
        reset() {
            this.searchForm.PersonCode = '';
            this.searchForm.UserName = '';
        },

        //获取数据
        dataBind() {
            this.isLoading = true
            this.$http.get('/api/OrderProductPick', {
                params: {
                    PageIndex: this.pageDomain.PageIndex,
                    PageSize: this.pageDomain.PageSize,
                    Number: this.searchForm.Number,
                    PickDate: this.searchForm.PickDate,
                    WarehouseName: this.searchForm.WarehouseName,
                    EmployeesName: this.searchForm.EmployeesName,
                    Status: 1
                }
            })
                .then(res => {
                    this.tableData = res.Data
                    this.pageDomain.TotalCount = res.Count
                    this.isLoading = false
                })
        },
        //分页方法
        handleSizeChange(val) {
            this.pageDomain.PageIndex = 1;
            this.pageDomain.PageSize = val;
            this.dataBind();
        },
        handleCurrentChange(val) {
            this.pageDomain.PageIndex = val;
            this.dataBind();
        },




         //获取仓库数据
        getWarehouseData() {
            this.$http.get('/api/Warehouse/GetAll')
                .then(res => {
                    this.WarehouseList=res.Data;
                })
        },



    }
}
</script>